new Vue({
    el: '#app',
    data: {
        userInfo: {
            userName: '',
            roleId: ''
        },
        stats: {
            totalSeats: 0,
            availableSeats: 0,
            occupiedSeats: 0,
            maintenanceSeats: 0
        },
        parkingSeats: [],
        searchKey: '',
        showModal: false,
        isEdit: false,
        form: {
            seatId: '',
            seatNum: '',
            seatSection: '',
            seatTag: '',
            seatState: '0'
        }
    },
    created() {
        this.loadUserInfo();
        this.loadParkingSeats();
        // this.loadStats();
    },
    methods: {
        // 加载用户信息
        loadUserInfo() {
            axios.get('../../userInfo')
                .then(response => {
                    if (response.data.success) {
                        this.userInfo = response.data.data;
                    }
                })
                .catch(error => {
                    console.error('Error loading user info:', error);
                });
        },
        // 加载车位列表
        loadParkingSeats() {
            axios.get('/Parks/parkingSeat/getAll')
                .then(response => {
                    if (response.data.code === 0) {
                        this.parkingSeats = response.data.data;
                        this.calculateStats(response.data.data);
                    } else {
                        alert(response.data.msg || '加载车位失败');
                    }
                })
                .catch(error => {
                    console.error('Error:', error);
                    alert('加载车位失败');
                });
        },

        // 计算统计数据
        calculateStats(seats) {
            this.stats.totalSeats = seats.length;
            this.stats.availableSeats = seats.filter(seat => seat.seatState === 0).length;
            this.stats.occupiedSeats = seats.filter(seat => seat.seatState === 1).length;
            this.stats.maintenanceSeats = seats.filter(seat => seat.seatState === 2).length;
        },

        // 显示添加表单
        showAddForm() {
            this.isEdit = false;
            this.form = {
                seatId: '',
                seatNum: '',
                seatSection: '',
                seatTag: '',
                seatState: '0'
            };
            this.showModal = true;
        },

        // 显示编辑表单
        showEditForm(seat) {
            if (seat.seatState === 1) { // 假设 1 表示占用状态
                alert('车位正在使用中，无法修改。');
                return;
            }
            this.isEdit = true;
            this.form = { ...seat };
            this.showModal = true;
        },

        // 关闭模态框
        closeModal() {
            this.showModal = false;
            this.form = {
                seatId: '',
                seatNum: '',
                seatSection: '',
                seatTag: '',
                seatState: '0'
            };
        },

        // 提交表单
        submitForm() {
            const url = this.isEdit ? 
                '/Parks/parkingSeat/update' : 
                '/Parks/parkingSeat/insert';
            
            // 确保seatState是数字类型
            this.form.seatState = parseInt(this.form.seatState);
            
            axios.post(url, this.form)
                .then(response => {
                    if (response.data.code === 0) {
                        alert(this.isEdit ? '更新成功' : '添加成功');
                        this.closeModal();
                        this.loadParkingSeats();
                    } else {
                        alert(response.data.msg || (this.isEdit ? '更新失败' : '添加失败'));
                    }
                })
                .catch(error => {
                    console.error('Error:', error);
                    alert(this.isEdit ? '更新失败' : '添加失败');
                });
        },

        // 删除车位
        deleteSeat(seatId) {
            const seat = this.parkingSeats.find(s => s.seatId === seatId);
            if (seat && seat.seatState === 1) { // 假设 1 表示占用状态
                alert('车位正在使用中，无法删除。');
                return;
            }
            if (confirm('确定要删除这辆车位吗？')) {
                axios.post('/Parks/parkingSeat/deleteById', { seatId })
                    .then(response => {
                        if (response.data.code === 0) {
                            alert('删除成功');
                            this.loadParkingSeats();
                        } else {
                            alert(response.data.msg || '删除失败');
                        }
                    })
                    .catch(error => {
                        console.error('Error:', error);
                        alert('删除失败');
                    });
            }
        },
        
        handleSearch() {
            if (this.searchKey) {
                const results = this.parkingSeats.filter(seat => 
                    (seat.seatSection && seat.seatSection.includes(this.searchKey)) || 
                    (seat.seatNum && seat.seatNum.includes(this.searchKey))
                );
    
                if( results.length === 0) {
                    alert("未找到该车位");
                    return;
                }
                this.parkingSeats = results; // 更新用户列表为搜索结果
            } else {
                this.loadParkingSeats(); // 如果没有搜索关键字，重新获取所有用户
            }
        },

        // 获取状态样式类
        getStatusClass(status) {
            const statusMap = {
                0: 'status-available',
                1: 'status-occupied',
                2: 'status-maintenance'
            };
            return statusMap[status] || '';
        },

        // 获取状态文本
        getStatusText(status) {
            const statusMap = {
                0: '空闲',
                1: '占用',
                2: '维护中'
            };
            return statusMap[status] || '未知';
        },

        // 退出登录
        handleLogout() {
            axios.post('/Parks/logout')
                .then(() => {
                    sessionStorage.removeItem('userInfo');
                    window.location.href = '../../login.html';
                })
                .catch(error => {
                    console.error('Error:', error);
                    alert('退出失败');
                });
        }
    }
}); 